<template>
    <view class="page-content" style="background:#F6F6F6;">
        <navbar fixed leftIcon="left" title="备份助记词" shadow></navbar>

        <view class="tips error m-l-24 m-r-24 m-t-30">
           拥有助记词等于拥有钱包资产所有权，<br />
		   请准确无误抄写助记词，并存放在安全的地方
        </view>

		<view v-if="show == 0" class="bg_e7e w338 flex-wrap view flex-row p-t-12 align-center justify-center" style="border-radius: 19px;margin:0 auto;margin-top:24rpx;">
		    <el-button @click="createMnemonicWord" class="btn-s" block style="border-radius: 12px !important;" type="primary">已认真阅读提示，开始创建</el-button>
		</view>
        <view v-else class="bg_e7e w338 flex-wrap view flex-row p-t-12 align-center justify-center" style="border-radius: 19px;margin:0 auto;margin-top:24rpx;">
            <view style="border-radius:10px;" class="zuji-item w91 h42 m-r-14 m-b-12 view align-center justify-center" v-for="(item,index) in list" :key="index">
                {{ item }}
            </view>
        </view>

        <view class="p-l-28 p-r-28 m-t-35">
            <view class="c-ec2 m-b-8">切记：</view>
            <view class="c-ec2 m-b-8">·请勿将助记词透露给任何人</view>
			<view class="c-ec2 m-b-8">·官方不会以任何理由所要你的助记词</view>
            <view class="c-ec2 m-b-8">·助记词一旦丢失，资产将无法恢复</view>
            <view class="c-ec2 m-b-8">·请勿通过截屏、网络传输的方式进行备份</view>
            <view class="c-ec2">·遇到任何情况，请不要轻易卸载钱包App</view>
        </view>

        <view class="p-l-20 p-r-20">
            <el-button @click="saveMnemonicWords"  class="btn-c" block style="border-radius: 12px !important;" type="primary">备份完成，进行验证</el-button>
            <!--<view @click="copyWord()" class="c_4e6 c-16 m-t-22 text-center">复制助记词</view>-->
        </view>
    </view>
</template>

<script>
import navbar from '@/components/uni-nav-bar'
import  uniEasyinput from '@/components/uni-easyinput/uni-easyinput'
import elButton from '@/components/el-button/el-button'
import noData from '@/components/noData/noData'
import sibList from '@/components/sib-list/sib-list.vue'

import { mapMutations } from "vuex"
import walletApi from "@/common/walletApi.js"
import copy from "@/common/tools.js"

export default {
    components: {
      navbar,
      uniEasyinput
	},
    data() {
        return {
          list: [],
		  word: "",
		  show: 0,
        }
    },
	onShow() {
	  //this.createMnemonicWord();
	  if(this.list.length > 0){
		  this.show = 1;
	  }
	},
    methods: {
		...mapMutations(['setMnemonicWords']),
		async createMnemonicWord() {
			//let web3 = walletApi.web3Init();
			this.mnemonicWords = await walletApi.createMnemonicWords();
			console.log('word',this.mnemonicWords);
			this.list = this.mnemonicWords.split(' ');
			this.word = this.mnemonicWords;
			this.show = 1;
		},
		saveMnemonicWords() {
			this.setMnemonicWords(this.mnemonicWords)
			uni.navigateTo({
				url: "/pages/wallet/mnemonic/verify?type=2"
			})
		},
		copyWord(){
			//copy(this.word)
			/*uni.showToast({
			  title: this.$lan('复制成功'),
			  icon: 'none',
			  duration: 2000
			});*/
		}
    }
    
};
</script>

<style lang="scss" scoped>
.bar1-title {
    color:#3C3C3C;
    font-size: 32rpx;
}

page {
    background: #F6F6F6;
}
.left-bar-item {width: 100%;height:68px;display: flex;align-items: center;justify-content: center;}
.left-bar-item .image{
    width:30px;
    height: 30px;
}
.left-bar-item.active {
    background: #F6F6F6;
}
.btn-c {
    display: block;
    margin-top:56rpx;
    width: 100%;
    height: 96rpx;
    line-height: 78rpx;
    font-size: 40rpx;
}
.btn-s {
	display: block;
	margin:14rpx;
	width: 80%;
	height: 70rpx;
	line-height: 50rpx;
	font-size: 34rpx;
	margin-bottom: 38rpx;
}
.zuji-item {background: #fff;border-radius: 10px;color:#6781FF;}
.fix-bottom {width: 100vw;height: 100px;background: #fff;bottom: 0;left: 0;padding-top:32rpx;position: fixed;}
</style>
